/**
* 提现
*/
import React, { Component } from 'react';
import { View, StyleSheet, Text, Image, TouchableOpacity, TextInput, ImageBackground, ScrollView } from "react-native";
import { connect } from 'react-redux';
import { create_service } from '../../redux/index.js';
import { Contract } from '../../service/index.js';
import { Colors, Dimens, ImageRes } from '../../utils/Assets';
import { ProgressView } from '../custom/index'
import { Actions } from 'react-native-router-flux';
import { getStore } from '../../redux/index.js';
import Toast from 'react-native-root-toast';
class ProfitWithdrawView extends Component {

    constructor(props) {
        super(props);
        this.state = {
            loading: false
        }
        this.userInfo = getStore().getState().auth.userInfo
    }

    componentDidMount() {
        this.getData()
    }
    getData() {
        this.setState({ loading: true })
        this.props.dispatch(create_service(Contract.POST_USER_CASH_CONFIG, { token: this.userInfo.token })).then((res) => {
            if (res) {
                this.cash_config = res
                if(!res.card){
                    Actions.profitBankListView({
                        reSelectBank: (bankInfo) => {
                            this.setState({
                                bank_logo: bankInfo.bank_logo,
                                bank_name: bankInfo.name,
                                bank_number: bankInfo.full_card_number,
                                bankcard_id: bankInfo.id
                            })
                        }
                    })
                }
                this.setState({ loading: false, bank_logo: res.card.bank_logo, bank_name: res.card.name, bank_number: res.card.full_card_number, bankcard_id: res.card.id })
            } else {
                this.setState({ loading: false })
            }
        })
    }
    withdraw() {
        if (!this.state.amount) {
            Toast.show('请输入提现金额', { position: Toast.positions.CENTER })
            return
        }
        if (parseInt(this.state.amount) > parseInt(this.props.income.balance)) {
            Toast.show('提现金额不能大于余额', { position: Toast.positions.CENTER })
            return
        }
        if (parseInt(this.state.amount) < parseInt(this.cash_config.minimum)) {
            Toast.show(`提现最小金额为${this.cash_config.minimum}`, { position: Toast.positions.CENTER })
            return
        }
        this.setState({ loading: true })
        this.props.dispatch(create_service(Contract.POST_USER_CASH, { token: this.userInfo.token, amount: this.state.amount, bankcard_id: this.state.bankcard_id })).then((res) => {
            if (res) {
                if (this.props.reloadData) {
                    this.props.reloadData()
                }
                // Actions.profitWithdrawResultView({ cash_id: res })
                Actions.replace('profitWithdrawResultView', { cash_id: res })
                // Toast.show('提取成功', { position: Toast.positions.CENTER })
                // Actions.pop()
            }
            this.setState({ loading: false })
        })
    }
    render() {
        let { income } = this.props
        return (
            <View style={styles.container}>
                <ScrollView showsVerticalScrollIndicator={false}>
                    <ImageBackground source={ImageRes.profit_bg} style={{ width: Dimens.DeviceWidth - 30, height: (Dimens.DeviceWidth - 30) * 0.4, margin: 15, justifyContent: 'space-between', borderRadius: 10 }} resizeMode={'contain'}>
                        <View style={{ marginTop: 15, marginLeft: 15 }}>
                            <Text style={{ fontSize: 15, color: "#ffffff" }}>我的余额</Text>
                            <Text style={{ fontSize: 20, color: "#ffffff", marginTop: 15, fontWeight: 'bold' }}>
                                {income.balance}
                            </Text>
                        </View>
                        <Text style={{ fontSize: 15, color: "#ffffff", marginTop: 15, fontWeight: 'bold', marginLeft: 15, marginBottom: 15 }}>{'提现最小金额￥' + (this.cash_config ? this.cash_config.minimum : 0)}</Text>
                    </ImageBackground>
                    <View style={{ backgroundColor: "#ffffff", marginTop: 15 }}>
                        <TouchableOpacity style={{ paddingVertical: 25, paddingHorizontal: 15, flexDirection: 'row', justifyContent: 'space-between' }} activeOpacity={0.8} onPress={() => {
                            Actions.profitBankListView({
                                reSelectBank: (bankInfo) => {
                                    this.setState({
                                        bank_logo: bankInfo.bank_logo,
                                        bank_name: bankInfo.name,
                                        bank_number: bankInfo.full_card_number,
                                        bankcard_id: bankInfo.id
                                    })
                                }
                            })
                        }}>
                            <View style={{ flexDirection: 'row' }}>
                                <Image style={{ width: 60, height: 60, borderRadius: 30 }} source={{ uri: this.state.bank_logo }}></Image>
                                <View style={{ justifyContent: 'space-between', marginLeft: 15 }}>
                                    <Text style={{ fontSize: 15, color: "#333333" }}>{this.state.bank_name}</Text>
                                    <Text style={{ fontSize: 15, color: "#333333" }}>{this.state.bank_number}</Text>
                                </View>
                            </View>
                            <Image style={{ width: 20, height: 20, alignSelf: 'center' }} source={ImageRes.team_right_arrow} resizeMode={'contain'}></Image>
                        </TouchableOpacity>
                        <View style={{ backgroundColor: Colors.bg_color, height: 1, marginHorizontal: 15 }}></View>
                        <Text style={{ fontSize: 18, color: "#333333", marginTop: 25, marginLeft: 15 }}>提现金额</Text>
                        <View style={{ marginTop: 25, flexDirection: 'row', marginHorizontal: 15 }}>
                            <Text style={{ fontSize: 22, color: "#333333", fontWeight: 'bold', alignSelf: 'center' }}>￥</Text>
                            <TextInput style={{ fontSize: 22, fontWeight: 'bold', color: '#333333', height: 55, flex: 1, marginLeft: 15 }}
                                onChangeText={(text) => {
                                    this.setState({ amount: text })
                                }}
                                placeholderTextColor={'#999999'}
                                underlineColorAndroid={'transparent'}
                                keyboardType={'numeric'}
                                placeholder={'请输入提款金额'}
                                value={this.state.amount}
                            />
                            <TouchableOpacity style={{ justifyContent: 'center' }} activeOpacity={0.8} onPress={() => {
                                this.setState({ amount: income.balance })
                            }}>
                                <Text style={{ fontSize: 15, color: "#378EFB" }}>全部提款</Text>
                            </TouchableOpacity>
                        </View>
                        <View style={{ backgroundColor: Colors.bg_color, height: 1, marginHorizontal: 15 }}></View>
                        <Text style={{ fontSize: 16, color: "#666666", marginTop: 15, marginLeft: 15 }}>{'费率' + (this.cash_config ? this.cash_config.fee : 0)}</Text>
                        <TouchableOpacity style={{ marginTop: 30, backgroundColor: '#378EFB', justifyContent: 'center', marginHorizontal: 15, paddingVertical: 15, borderRadius: 5 }} activeOpacity={0.8} onPress={() => {
                            // Actions.withdrawPasswordView({
                            //     callBack: (password) => {
                            //         Actions.profitWithdrawResultView()
                            //     }
                            // })
                            this.withdraw()
                        }}>
                            <Text style={{ fontSize: 15, color: "#ffffff", alignSelf: 'center' }}>提现</Text>
                        </TouchableOpacity>
                    </View>
                </ScrollView>
                <ProgressView show={this.state.loading} />
            </View>
        )
    }
}
const styles = StyleSheet.create({
    container: {
        backgroundColor: Colors.bg_color,
        paddingBottom: Dimens.isIPhoneX ? 15 : 0,
        flex: 1
    }
});
const ExportView = connect()(ProfitWithdrawView);
ExportView.renderRightButton = (props) => {
    return (
        <TouchableOpacity style={{ marginRight: 15, justifyContent: 'center', alignSelf: 'center' }} onPress={() => {
            Actions.profitWithdrawListView()
        }}>
            <Text style={{ fontSize: 15, color: '#ffffff', alignSelf: 'center' }}>提现记录</Text>
        </TouchableOpacity>
    )
}
module.exports.ProfitWithdrawView = ExportView
